/*
 * @Description: 4.表单常规单元组件 item—normalCell (INC1)
 * @Author: skj
 * @Date: 2019-08-29 11:15:45
 * @LastEditors: skj
 * @LastEditTime: 2019-08-30 10:22:50
 */
import React, { Component } from "react";
import { View, StyleSheet, Text, ViewPropTypes, Image, TouchableOpacity } from "react-native";
import PropTypes from "prop-types";
import Badge from "react-native-elements/src/badge/Badge";
import Line from "../item-line/index";

export const BadgeType = {
    circle: "0",
    simple: "1"
};
export default class ItembadgeView extends Component {
    renderCountNum = () => {
        const { number, badgeType, badgeTextStyle, badgeStyle } = this.props;
        let showNum = number > 0 ? true : false;
        if (showNum) {
            return badgeType == BadgeType.circle ? (
                <Badge
                    value={number}
                    textStyle={[styles.badgeText, badgeTextStyle]}
                    badgeStyle={[styles.badgeStyle, badgeStyle]}
                />
            ) : (
                <Text style={[styles.simple_BadgeTextStyle, { color: "#444444" }]}>{number}</Text>
            );
        }
        return null;
    };
    render() {
        const { title, titleStyle, onPress, showBottomLine, speratorLineStyle,activeOpacity } = this.props;
        return (
            <TouchableOpacity activeOpacity={activeOpacity} onPress={onPress}>
                <View style={styles.container}>
                    <Text style={[styles.titleStyle, titleStyle]} numberOfLines={1} includeFontPadding={false}>
                        {title}
                    </Text>
                    <View style={{ flexDirection: "row" }}>{this.renderCountNum()}</View>
                    <Image style={styles.accessoryStyle} source={require("../images/item_arrow.png")} />
                </View>
                {showBottomLine && <Line style={[{ marginLeft: 0 }, speratorLineStyle]} />}
            </TouchableOpacity>
        );
    }
}
ItembadgeView.propTypes = {
    title: PropTypes.string, //标题
    number: PropTypes.any, //红点数
    titleStyle: PropTypes.oneOfType([Text.propTypes.style,ViewPropTypes.style]),
    badgeStyle: ViewPropTypes.style,
    badgeTextStyle: Text.propTypes.style,
    badgeType: PropTypes.oneOf([BadgeType.circle, BadgeType.simple]),
    onPress: PropTypes.func,
    showBottomLine: PropTypes.bool,
    speratorLineStyle: ViewPropTypes.style,
    activeOpacity:PropTypes.number
};
ItembadgeView.defaultProps = {
    title: "标题",
    badgeType: BadgeType.circle,
    badgeTextStyle: Text.propTypes.style,
    badgeStyle: ViewPropTypes.style,
    showBottomLine: true,
    activeOpacity:0.62
};
const styles = StyleSheet.create({
    container: {
        height: 50,
        backgroundColor: "#ffffff",
        alignItems: "center",
        flexDirection: "row"
    },
    titleStyle: {
        color: "#444444",
        fontSize: 15,
        marginLeft: 15,
        flex: 1
    },
    accessoryStyle: {
        marginRight: 15
    },
    badgeStyle: {
        backgroundColor: "#E83C36",
        marginRight: 8
    },
    badgeText: {
        fontSize: 13,
        color: "#fff"
    },
    simple_BadgeTextStyle: {
        color: "#444444",
        fontSize: 15,
        marginRight: 8,
        textAlignVertical: "center"
    }
});
